:host ::ng-deep .mat-tree-node {
    min-height: 24px;
    font-family: monospace;
    font-size: 10pt;
    margin-bottom: -1px;
    overflow-wrap: anywhere;
    justify-content: space-between;

    &:hover {
        background-color: rgba(0, 0, 0, 0.2);
    }
}

:host ::ng-deep .mat-icon-button {
    margin: -0.5rem 0;
    transform: scale(0.7);
}

:host ::ng-deep table.this-table {
    table-layout: initial !important;
}

:host ::ng-deep table.this-table tr {
    height: 30px !important;
}

:host ::ng-deep table.this-table th.mat-header-cell,
:host ::ng-deep table.this-table td.mat-cell {
    padding: 0 5px !important;
}

:host {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    align-content: stretch;
    height: 100%;
    flex: 1;

    .field-sticky {
        top: 0px;
        position: sticky;
        background-color: white;
        width: 100%;
        z-index: 1;
        padding: 0.2rem;
        border-bottom: 2px solid rgba(0, 0, 0, 0.2);
        border-top: 1px solid rgba(0, 0, 0, 0.2);
    }

    .flex-container {
        display: flex;
        align-items: stretch;
        background: aliceblue;
        height: 100%;
        align-content: stretch;
        overflow: hidden;
        flex-direction: column;

        &>div {
            transition: all 0.3s;
            // transition-delay: 1s;
            flex: 1;
            overflow: auto;
            // margin: 1px;
            // padding: 1px;
            // border: 1px solid #999;

            .line-html {
                flex: 1;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            // &:hover {
            //     flex: 10;
            // }
        }
    }
}